<template>
  <uni-forms-item v-bind="itemProps">
    <template v-if="type == 'radio'">
      <div class="form-item-content">
        <uni-data-checkbox v-model="data" :localdata="inputProps.options" />
      </div>
    </template>
    <template v-else-if="type == 'checkbox'">
      <div class="form-item-content">
        <uni-data-checkbox multiple v-model="data" :localdata="inputProps.options" />
      </div>
    </template>
    <template v-else-if="type == 'select'">
      <uni-data-select v-model="data" :localdata="inputProps.options" :placeholder="inputProps.placeholder" />
    </template>
    <template v-else-if="type == 'data-picker'">
      <uni-data-picker :localdata="inputProps.options" v-bind="inputProps"> </uni-data-picker>
    </template>
    <template v-else>
      <uni-easyinput type="text" v-model="data" :placeholder="inputProps.placeholder" />
    </template>
  </uni-forms-item>
</template>
<script setup>
const emits = defineEmits(['update:modelValue'])
const props = defineProps({
  modelValue: [String, Number],
  type: { type: String, default: 'text' },
  itemProps: Object,
  inputProps: Object,
})

const data = computed({
  get: () => props.modelValue,
  set: val => emits('update:modelValue', val),
})
</script>
<style lang="scss" scoped></style>
